<template>
  <view class="tabbar">
    <view
      class="tabbar-item"
      v-for="(item, index) in list"
      :key="'tabbar' + item.index"
      @click="changeTab(item.index)"
    >
      <image
        class="img"
        :src="item.selectedIconPath"
        v-if="current == item.index"
      ></image>
      <image class="img" :src="item.iconPath" v-else></image>
      <view class="text active" v-if="current == item.index">{{
        item.text
      }}</view>
      <view class="text" v-else>{{ item.text }}</view>
    </view>
  </view>
</template>

<script setup>
  import { onReady } from '@dcloudio/uni-app'
  import { ref, reactive } from 'vue'
  import { onShow, onLoad } from '@dcloudio/uni-app'
  import { useUsercodeStore } from '@/store/usercode.js'
  import { http } from '@/utils/http.js'
  import { serverpath } from '@/utils/const.js'
  const props = defineProps({
    current: Number,
  })
  const list = ref([
    {
      text: '首页',
      pagePath: 'pages/home/index',
      iconPath: '/static/home.png',
      selectedIconPath: '/static/home-active.png',
      index: 0,
    },
    {
      text: '商城',
      pagePath: 'pages/draw/index',
      iconPath: '/static/draw.png',
      selectedIconPath: '/static/draw-active.png',
      index: 1,
    },
    {
      text: '背包',
      pagePath: 'pages/bag/index',
      iconPath: '/static/bag.png',
      selectedIconPath: '/static/bag-active.png',
      index: 2,
    },
    {
      text: '我的',
      pagePath: 'pages/mine/index',
      iconPath: '/static/mine.png',
      selectedIconPath: '/static/mine-active.png',
      index: 3,
    },
  ])
  async function changeTab(e) {
    if (e == 1) {
      const res = await http.request({
        url: '/api/user/userMsg',
        method: 'POST',
        data: {},
      })
      const is_effect = res.data.data.is_effect
      const userCodeStore = useUsercodeStore()
      const { token } = userCodeStore.usercode
      if (serverpath != 'https://ouhun.wm2177.com/') {
        reLaunchtoPage(e)
        return
      }
      if (!token || is_effect != 1) {
        console.log(111)
        // reLaunchtoPage(e) // ios
        uni.navigateTo({
          url: `/homePage/mall/index?id=0`,
        })
        return
      } else {
        reLaunchtoPage(e)
        return
      }
    } else {
      reLaunchtoPage(e)
    }
  }
  function reLaunchtoPage(e) {
    uni.reLaunch({
      url: '/' + list.value[e].pagePath,
      success: function (e) {
        let currentPage = getCurrentPages().pop()
        if (currentPage == undefined || currentPage == null) return
        // currentPage.onReady()
      },
    })
  }

  onShow(() => {})
</script>

<style lang="scss" scoped>
  .tabbar {
    position: fixed;
    left: 0;
    bottom: 0;
    z-index: 99;
    width: 100%;
    height: 182rpx;
    display: flex;
    align-items: center;
    justify-content: space-around;
    background-color: #ffffff;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    box-shadow: 0rpx -19rpx 54rpx 0rpx rgba(34, 34, 34, 0.05);
    /* padding-bottom: constant(safe-area-inset-bottom);
  padding-bottom: env(safe-area-inset-bottom); */
  }
  .tabbar-item {
    padding: 0 40rpx;
    text-align: center;
  }
  .img {
    height: 60rpx;
    width: 60rpx;
  }
  .text {
    font-size: 20rpx;
    font-weight: 500;
    color: #1f1f1f;
  }
  .text.active {
    color: #1f1f1f;
  }
</style>
